/*
 * @Author: DaQing Lu
 * @Date: 2020-01-24 14:15:34
 * @LastEditors  : DaQing Lu
 * @LastEditTime : 2020-02-13 15:53:27
 * @Description: file content
 */
import React, {useState} from 'react';
import {Modal, Table} from 'antd';

function OrderDetails({data, ...props}) {

  const [columns] = useState([
    {
      title: '商品图片',
      dataIndex: 'goods_logo',
      render: (text, data) => {
        return (
          <img style={{width: '60px'}} src={data.goods_logo} alt="图片加载失败..."/>
        );
      }
    },
    {
      title: '商品名称',
      dataIndex: 'goods_title',
      key: 'goods_title'
    },
    {
      title: '数量',
      dataIndex: 'number',
      key: 'number'
    },
    {
      title: '单价',
      dataIndex: 'selling_price',
      key: 'selling_price'
    },
    {
      title: '供应商名称',
      dataIndex: 'vendor_name',
      key: 'vendor_name'
    },
    {
      title: '状态',
      dataIndex: 'goods_spec',
      key: 'goods_spec'
    }
  ]);
  return (
    <div className={'OrderDetails'}>
      <Modal
        width={1200}
        title='详情'
        visible={props.visible}
        onOk={() => props.handleOk(1)}
        onCancel={() => props.handleCancel(1)}
      >
        <Table dataSource={data} columns={columns}/>
      </Modal>
    </div>
  );
}

export default OrderDetails;
